﻿html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, select, button, input, textarea, h4 {
    margin: 0;
    padding: 0;
}

body {
    color: #000;
    background-color: #fff;
    font: 12px/20px "Microsoft YaHei";
}

ul, ol {
    list-style: none;
}

    ul li {
        vertical-align: top;
    }

select, button, input, textarea {
    font-size: 12px;
    line-height: normal;
}

em {
    font-style: normal;
}

img {
    vertical-align: middle;
    border: 0;
}

a {
    color: #333;
    text-decoration: none;
}

    a:hover {
        text-decoration: none;
        color: #d81515;
    }

img {
    border: none;
}

.clear {
    zoom: 1;
}

    .clear:after {
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }
html,body{height:100%}
body{background:url(../images/bg.jpg) no-repeat top center;background-size:100% 100%;position:relative}
.login_box{position:fixed;width:570px;height:478px;left:50%;margin-left:-285px;top:50%;margin-top:-239px;background:#fff;border-radius:5px;z-index:99;box-shadow:0 0 5px #939393}
.login_box_con{padding:0 66px;position:relative}
.login_box h1{text-align:center;color:#34506c;font-size:45px;line-height:124px;letter-spacing:8px}
.login_box .hd{width:100%;height:124px;margin-bottom:42px}
.login_form{}
.login_form dl dt{background:url(../images/line1.jpg) no-repeat;height:55px;position:relative;margin-bottom:40px;}
.login_form dl dt strong{position:absolute;left:0;top:0;width:52px;height:52px;z-index:999}
.login_form dl dt strong.icon1{background:url(../images/icon_account.png) no-repeat left center;}
.login_form dl dt.erro strong.icon1{background:url(../images/icon_account_red.png) no-repeat left center;}
.login_form dl dt.right strong.icon1{background:url(../images/icon_account_green.png) no-repeat left center;}
.login_form dl dt strong i{}
.login_form dl dt strong.icon2{background:url(../images/icon_pwd.png) no-repeat left center;}
.login_form dl dt.erro strong.icon2{background:url(../images/icon_pwd_red.png) no-repeat left center;}
.login_form dl dt.right strong.icon2{background:url(../images/icon_pwd_green.png) no-repeat left center;}
.login_form dl dt p{margin-left:40px;margin-right:0px;position:relative;}
.login_form dl dt p .inputstyle1{width:100%;height:50px;line-height:50px;border:none;background:none;font-size:18px;outline:none;}
.login_btn{margin-top:5px;display:inline-block;width:100%}
.login_btn p{text-align:center;margin-top:10px}
.login_btn p .inputbtn1{width:100%;height:60px;line-height:60px;font-size:22px;color:#fff;text-align:center;border:none;background:#304a63;border-radius:5px;cursor:pointer;outline:none;box-shadow:0px 4px 8px #bdd1e3}
.login_btn p .inputbtn1:hover{opacity:0.8}

form .field_notice{color:#999;margin-left:0px}
form .red{color:red;border:0;background-color:#FFF;}
form label.error{vertical-align:middle;font-weight:400;position:absolute;right:0px;top:0;height:55px;padding-left:40px;width:400px;background:url(../images/line3.jpg) #fff no-repeat left center;font-size:18px;line-height:48px;color:#ea4242;overflow:hidden;}
.login_form dl dt.erros{border:#ff0000 1px solid}
form label.checking{padding-left:18px;background:transparent url(../images/checking.gif) no-repeat;margin-left:5px;font-style:italic;color:#9c9c9c;display:none}
form label.validate_right{background:url(../images/line2.png)  no-repeat left center;}
/*错误提示 20151201*/
.has-error .caution{
	vertical-align: middle;
    color: #f00;
    display: inline-block;
    padding: 9px 10px;
    background: #FFEBEB;
    border: 1px solid #ffbdbe;
    margin-left: 10px;
    line-height: 16px;
}
body{overflow:hidden}
#progressBar{
            width: 100%;
            height: 2px;
            position: relative;
        }
        #progressBar div{
            width: 100%;
            height: 2px;
            position: absolute;
            top:0;
            left: 0;
            background:transparent;
        }
        #progressBar div span{
            position: absolute;
            display: inline-block;
            background:#304a63;
            height: 2px;
            width: 100%;
            -webkit-animation:bgLoad 5.5s linear;
        }
        @-webkit-keyframes bgLoad{
            0%{
                width: 0%;
            }
            100%{
                width:100%;
            }
        }
        #progressBar>span{
            position: absolute;
            top:0;
            margin-top: -10px;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background: #ccc;
            margin-left: -20px;
            color:#fff;
        }
        @-webkit-keyframes circleLoad_1{
            0%,66.66%{
                background: #ccc;
            }
            100%{
                background:green;
            }
        }
        @-webkit-keyframes circleLoad_2{
            0%,83.34%{
                background: #ccc;
            }
            100%{
                background:green;
            }
        }
        @-webkit-keyframes circleLoad_3{
            0%,88.88%{
                background: #ccc;
            }
            100%{
                background:green;
            }
        }
        @-webkit-keyframes circleLoad_4{
            0%,91.67%{
                background: #ccc;
            }
            100%{
                background:green;
            }
        }
    @keyframes myfirst
{
from {top:1000px;left:0px;}
to {top:-200px;left:1200px;}
}

@-moz-keyframes myfirst /* Firefox */
{
from {top:1000px;left:0px;}
to {top:-200px;left:1200px;}
}

@-webkit-keyframes myfirst /* Safari 和 Chrome */
{
from {top:1000px;left:0px;}
to {top:-200px;left:1200px;}
}

@-o-keyframes myfirst /* Opera */
{
from {top:1000px;left:0px;}
to {top:-200px;left:1200px;}
}

#myimg{
position:absolute;left:-200px;bottom:-200px;
animation: myfirst 3s;
-moz-animation: myfirst 3s;	/* Firefox */
-webkit-animation: myfirst 3s;	/* Safari 和 Chrome */
-o-animation: myfirst 3s;	/* Opera */
-webkit-animation-iteration-count:1;//运行1次
-webkit-animation-fill-mode:forwards;//运行后停留在最后的地方

}

 @keyframes myfirst2
{
from {top:1500px;left:1500px;}
to {top:-200px;left:200px;}
}

@-moz-keyframes myfirst2 /* Firefox */
{
from {top:1500px;left:1500px;}
to {top:-200px;left:200px;}
}

@-webkit-keyframes myfirst2 /* Safari 和 Chrome */
{
from {top:1500px;left:1500px;}
to {top:-200px;left:200px;}
}

@-o-keyframes myfirst2 /* Opera */
{
from {top:1500px;left:1500px;}
to {top:-200px;left:200px;}
}

#myimg2{
position:absolute;left:-200px;bottom:-200px;
animation-delay:3s;
-webkit-animation-delay:3s;
animation: myfirst2 6s;
-moz-animation: myfirst2 6s;	/* Firefox */
-webkit-animation: myfirst2 6s;	/* Safari 和 Chrome */
-o-animation: myfirst2 6s;	/* Opera */
-webkit-animation-iteration-count:1;//运行1次
-webkit-animation-fill-mode:forwards;//运行后停留在最后的地方

}